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ABSTRACT 



This paper presents a system that makes it a simple task to 
create Web pages that provide explanations based on images or diagrams. The 
result approaches the dynamic presentations teachers are used to doing with 
the help of a blackboard or overhead project system. This naturally leads to 
the question of what constitutes a good explanation. The paper shows that 
some intelligent adaptive properties have to be included into the system in 
order to tailor the explanations to the needs of individual learners . The 
Easy-Web-Explainer is used to create pedagogic resources to be inserted in a 
curriculum. The system proposes a generic structure that can be used in the 
context of many teaching disciplines (from concrete, such as how to operate 
some kinds of equipment to perform a task, to abstract, such as understanding 
a proof in mathematics) that can be helped by embedding pictures and diagrams 
in a discourse. (AEF) 
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Abstract: We present a system that makes it a simple task to create web pages that provide 
explanations based on images or diagrams. The result approaches the dynamic presentations 
teachers are used to do with the help of a blackboard or overhead projection system. This naturally 
leads to the question of what constitutes a good explanation. We will show that some intelligent 
adaptive properties have to be included into the system in order to tailor the explanations to the 
needs of individual learners. The Easy-Web-Explainer is used to create pedagogic resources to be 
inserted in a curriculum. 



I - Introduction: Explanation presentation versus explanation generation. 

Most of the literature associated with Computed Intelligent Assisted Education (Wenger 1987) has 
concerned itself with the automatic generation of explanations from first principles (sometimes embedded in a 
micro-world) or from more or less structured knowledge bases. The work presented here takes another, 
complementary point of view. Given some knowledge available in one or several alternative forms, the objective is 
to adapt the presentation to learners needs and preferences. For many subject domains the state of the art in Artificial 
Intelligence limits the kinds of reasoning that can be simulated, or if not, the amount of required coding work is 
prohibitive. Without trying to reinstate CAL with its rather inflexible ways of driving a learning session, we show 
here that there is ample room for works to improve the way more or less rigidly structured information can best be 
presented to learners. 

The proper temporal sequencing and spatial layout of information is considered here as a major factor in 
facilitating the understanding of complex information, even though their importance can vary from individual to 
individual (Luger 94). The usefulness of carefully exhibiting the structure of a reasoning can be linked to diverse 
sources. Clearly, some learners can be helped by information displays that alleviate demands on short term memory. 
For instance, in it has been argued that a proper indentation of solution steps in Mathematics and Physics problems 
significantly facilitates problem solving (Ramsey 83). In the Dynaboard project (Kaltenbach & Frasson 89), the case 
has been made for laying out a reasoning spatially in such a way that important properties of the reasoning, such as 
symmetry, would appear more clearly. Also, it has been found that spatial layouts of formal reasoning facilitate 
processes of abstraction and the discovery of useful analogies. The main idea underlying Dynaboard was to provide 
computer facilities that could significantly support the editing and reading of complex mathematical proofs 
displayed as demonstration graphs. It was shown that of necessity, in order not to surcharge the graphic layout of a 
proof, the graphic objects, such as arrows, had to carry ambiguous meaning. However, this defect could be 
eliminated by providing ways of dynamically refining the interpretation of a graphic object at the time of reading. 
The nesting of information levels and the spatial metaphor were subsequently introduced in order to achieve a good 
compromise between computer screen area usage and the need to display spatially rather complex and large 
information structures (Kaltenbach, Robillard & Frasson 91). The Easy-Web-Explainer system presented in the 
following aims to generalize these effects in the context of the web, by making the structuring and re-structuring of 
information units rather simple and natural. 

The current system proposes a generic structure that can be used in the context of many teaching disciplines 
(from concrete, such as how to operate some kind of equipment to perform a task, to abstract such as understanding 
a proof in Mathematics) that can be helped by embedding pictures and diagrams in a discourse. The next section 
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shows how the current system is used by a learner. The following one describes the authoring processes. Finally, 
based on the limited experimentation so far, it is shown how the advantages of a greater exploitation of student 
modeling could improve the system. 



II - The Easy-Web-Explainer system 

1 - The explainer explained 

Our objective in creating an explainer system is essentially to help learners structure information sequences 
into meaningful units that can be inserted in ever increasing contexts. These units are traversed in forward mode by 
the learner as many times as necessary before proceeding to the next unit. 
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Let x be an element of the complement of K 
This is possible because K is a proper subset of R n 



Figure 1: Starting an explanation associating text and diagram. 

Figures 1 presents the basic structure of the explainer for a single level of explanation. This is a framed web 
page in which the top frame contains the title of an explanation in Mathematical Analysis. For students to follow the 
successive steps of the explanation they must click successively on the white hand in the left panel. The red hand in 
the panel on the right points to a part of the diagram for which a text explanation is given in the bottom panel. The 
bottom frame explanations are web pages and so can contain multimedia components in addition to text. In 
particular the text can be spoken so that learners do not have to alternate their gaze between the bottom text and the 
diagram. An explanation proceeds by pointing successively at various points of the diagram (called here “ focal 
points” or “foci”). The left panel in Figure 1 lists the successive steps of an explanation. Each step can contain 
several foci. The steps are designed as a compromise between two extremes; on the first hand each explanation step 
should constitute a meaningful unit and on the other hand each step should be reasonably brief. If in the design of an 
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explanation, the explanation author cannot get a good compromise, this is a sign that the explanation should be 
presented with more levels. The current implementation provides for two levels of explanation. Ideally, as we shall 
ails in the third part of this paper, the way of structuring the information to be displayed by the 

In Figures 1, not much textual (possib 

the traversal of the successive focal points of an explanation step rather fast. The idea is to try to approximate the 
dynamics and tempo of explanations provided by human teachers so as to facilitate in the learner’s mind the 
chunking of significant knowledge units. When checked the check box just above the list of explanation steps will 
automatically chain one explanation step after the other, meaning that by default no explanation is repeated. 
However by clicking on any radio button of the explanation step sequence, the learner can go to the start of any 
explanation step. If the checkbox is unchecked the explanation step proceeds until a statement indicating the end of 
the step is indicated. If the learner does not click on the next step, then the explanation is repeated. 



2 - Creating an explanation with the Easy-Web-Explainer 

The Easy-Web-Explainer software is presented here by roughly following the successive stages of the 
creation of an explanation. When the application is started the user gains access to the main panel presented in 
window “Control Panel” shown in Figure 2.. Explanations are structured according to the file and directory 
hierarchy of Microsoft Windows. An explanation corresponds to one directory and explanations can in principle be 
nested to any arbitrary level since an explanation (directory) may contain several explanations (sub-directories). 
The “New Explanation” button opens a files/directories browser that enables the explanation author to position a 
new explanation in the current explanation hierarchy. The system distinguishes between two types of inserted new 
explanation; an explanation that gets inserted in the sequence of already existing explanations and an explanations 
that comes as a refinement of an existing explanation step. This second case is used to provide a deeper or 
alternative explanation to an existing explanation step. In either case the new explanation is positioned by simple 
clicks on Windows Explorer types of structures. Hyperlink management is automatic; buttons and links are inserted 
or created on existing explanation pages and the new explanation to reflect the new organization. As a result of this 
operation a directory is created at the proper place in the directory hierarchy with a name requested from the user 
and a generic framework of an explanation is created as HTML pages in that directory. 

By clicking on the button “Open” the user gets a directory selection box to select an existing explanation. 
With a click on button “Steps” the user can then see a list of current explanation steps (Window “Get Explanation 
Steps in Figure 2). This window can be used to go directly to view or edit an explanation step as described in the 
next paragraph. The captions for the successive explanation steps can be edited (replacing the default numbering 
system). Currently the suppression or addition of an explanation step not at the end of the existing sequence of steps 
is possible but awkward, requiring a form of successive copy and paste operations to create a new sequence from the 
old one. The automation of this process is under way. More generally a graphic editor for explanation sequences in 
the form of graphs (as in Figure 4) should be developed. 

To Edit or create a new explanation step the user clicks on button “Edit/Fill a Step”. This brings forth a 
window “Get Foci” as seen in Figure 2. The explanation step number is displayed on the top right text field and is 
incremented automatically with each new explanation step. This window enables the user to enter the name of a Gif 
or Jpeg file to be used in the explanation (here “FPanel.jpg”). Though it is possible to vary this image with each new 
focal point, usually the same image is used throughout an explanation step. The graphic files have to be prepared 
outside of the current Easy-Web-Explainer with adequate graphic software. Currently the user has just to place these 
files in the directory of the current explanation. To get the graphic to display in the right window panel, the user 
clicks again on button “Fill a Step” of the control panel. At this point the user is ready to enter the information 
relative to the focal points of interest (foci) for this graphic. In the current version of Easy-Web-Explainer is 
necessary to calibrate the graphic in order to insure that the focal points defined in it will be reflected exactly in the 
Netscape Navigator browser. Then it suffices to click on a point of the image to get the coordinates. To enter a 
particular focal point, the user clicks on button “New Focus”, then clicks on a particular point of the diagram. This 
writes the coordinates of the point as the last item in the focus point list on the XY text field. Of course the 
information already entered can be edited. The window “Get Foci” in Figure 2, show the focal points associated 
with a presentation of the user interface of a car radio/cassette player. The user has clicked on the first focal point 
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this shows the pointing hand at coordinates (90,50) on the image of the radio. This has also resulted in the automatic 
opening of the window “Explanation 
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Figure 2: 



The “Select pointer” button allows the user to select a particular form of pointer to point to be displayed over the 
graphic. Currently there are two pointer types available, a hand and arrows with different orientation angles. More 
choices will be available in the future, in particular a tool to highlight particular areas of a diagram or image. 
Eventually, users should be able to use highlights of their own design. It is also projected to make it possible to 
handle several highlights at the same time, or several highlights in automatic succession (i.e. without intervention by 
the user). 

On terminating an explanation step the user needs to save the information by clicking on button 
“Save/Update”. It is easy to add more focal points to an explanation step. As mentioned before, rearranging the 
sequence of focal points is more complex and should be attended to in the next version of the software. Figure 3 
shows the focal point corresponding to Figure 2, as seen by a learner. 
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- Experimentation and proposed extensions 

The Easy Web- 

course to taught at Universite Paris-Sud (France). Following some preliminary testing with a 

Faculty, it was considered that the dynamic explanations contributed positively to student’s understanding of 

difficult points. 

However it has been found that the system could manage better the transitions between the successive 
levels o -Web Explainer, 

in addition to the introduction of a sophisticated preference system in which the learner can prescribe the way in 

ted, the system is designed to record the past navigation choices the learner has 
made and learn from that information the best way to proceed in the future. 

Figure presents a diagram of how the various levels of an explanation are arranged at present. Four levels 
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1 . the explanation level represented by indented hyperlinks on a web page 

2. the steps for one explanation 

3. the focal points for one step 

4. additional refinements to one focal point (replacing it with more focal points) 



With more levels of explanations as well as alternative paths, the problem of specifying a default mode of 
traversal is more complex. For instance one learner may wish to perform successively deeper traversals of a step and 
then perform a shallower traversal to get an overview. Another learner may prefer a bottom up approach, etc. 

The intended future behavior of the system is that when it has gathered enough evidence to suggest a better 
navigation alternative for the learner, it intervenes with a suggestion on changing the preferences and implements it 
if the learner agrees. 

Further improvements to the system will involve the taking into account of the subject matter that is 
presented in an explanation, providing the successive explanation steps can be indexed by categories such as for 
instance “abstract” or “concrete”. The recording of statistics across multiple users could also lead to improvements 
by helping identify distinct categories of learners. More generally taking into account what the learner already 
knows and anticipating on what is the most adequate explanation for that student remains mostly an open problem. 

In the near future further development will be made to provide alternative explanations and ways of 
highlighting the differences between the alternative explanations. 

Successive click to unfold an explanation can be fastidious. Introducing ways to automatically unfold an 
explanation poses the problem of determining the rhythms at which the unfolding should take place and of how to 
manage user interruptions. We shall look for ways of controlling adequately the rhythm of exposition and how to 
change adequately between several modalities: self-paced versus auto-play, interruptible, controlled review or 
unrestricted backtrack. 



Conclusion 

Clearly, as far as computer based education is concerned, “Information Kinestetics” or the adequate 
presentation of structured subject matter is still a subject matter in infancy. Between the kind of current web-based 
tutorials, that are mostly on-line books with page turning facilities, and the advanced Multimedia, CD-ROM based 
course there is still ample room for useful developments that would better reflect the remarkable way humans 
acquire and restructure their information. As it stands our Web Explainer system make it easy to relate verbal and 
diagrammatic information on web pages. 
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